import React, { FC, useEffect } from 'react';
import { List } from 'antd';
import Link from 'umi/link';
import { connect } from 'dva';
import { Boss } from '@/models/boss';
import styles from './style.less';

const Job: FC<any> = ({ bosss, checkedKeys, dispatch }) => {
  useEffect(() => {
    dispatch({
      type: 'bosss/fetchBosss',
      payload: { deptIds: checkedKeys },
    });
  }, [checkedKeys]);
  const { data }: { data: Array<Boss> } = bosss;
  return (
    <div>
      <List
        itemLayout="vertical"
        pagination={{
          pageSize: 5,
        }}
        dataSource={data}
        renderItem={item => (
          <List.Item
            key={item.id}
            extra={
              <Link
                to={{
                  pathname: '/boss/info',
                  state: { ...item },
                }}
              >
                立即加入
              </Link>
            }
          >
            <List.Item.Meta
              title={<strong style={{ fontSize: '18px' }}>{item.postion}</strong>}
              description={
                item.address +
                ' | ' +
                item.startYear +
                '-' +
                item.endYear +
                '工作经验' +
                ' | ' +
                item.education
              }
            />
            <p
              className={styles.description}
              dangerouslySetInnerHTML={{ __html: item.positionDuty }}
            ></p>
          </List.Item>
        )}
      />
    </div>
  );
};

export default connect((state: any) => state)(Job);
